/**
 * Created by sfr on 2017/10/10.
 */
import React from "react";
import {connect} from "dva";
import { createForm } from 'rc-form';
import { routerRedux } from 'dva/router';
import moment from 'moment';
import {Flex,WhiteSpace,Icon,List} from "antd-mobile";
import styles from './workDetails.less';
const empty = require('is-empty');
const Item = List.Item;

import new1 from '../../../../assets/news/people.jpg';
import s from '../../../../svgs/work/examine.svg';
class WorkAdd extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      files: [],//上传的图片
    };
  }
  //==生命周期--页面渲染
  render() {
    const {query} = this.props.location
    const workDetails=this.props.workLog.data
    console.log(workDetails,'aaaaaaaaaaaaaaaaaaaaaaaaa')
    // console.log(this.props.location,'this.props.location')
    let obj = {type:`${query.id}`}; // adopt通过   Fail未通过
    let state;
    let svg ;
    switch (obj.type)
    {
      case 'examine':
        svg =  <Icon type={require('../../../../svgs/work/examine.svg')} />;
        break;
      case 'adopt':
        svg =  <Icon type={require('../../../../svgs/work/adopt.svg')} />;
        state = <span style={{color:'green'}}>已同意</span>;
        break;
      case 'fail':
        svg =  <Icon type={require('../../../../svgs/work/fail.svg')} />;
        state = <span style={{color:'#ff0000'}}>已拒绝</span>;
        break;
    }
    return (
      <div className='workDetails' style={{backgroundColor: '#eee'}}>
        <WhiteSpace />
        <WhiteSpace />
        <div style={{display:'flex',backgroundColor:'white',padding:'0.25rem'}}>
          <div style={{width:'80%',lineHeight:1.5}}>
            <div style={{display:'table-cell',verticalAlign:"middle"}}>{!empty(workDetails)&&workDetails[0].art_title}</div>
            <div style={{color:"#767676",fontSize:"0.3rem"}}>审批未通过</div>
          </div>
          <div style={{width:'20%',paddingLeft:'0.2rem',display:'flex'}}><div style={{margin:"auto"}}>{svg}</div></div>
        </div>
        <div style={{color:"#767676",fontSize:"0.32rem",padding:'0 0.25rem 0.25rem 0.25rem',backgroundColor:'white',lineHeight:1.5,letterSpacing:'0.015rem'}}>
          {/*这里是任务详情描述，默认显示全部，一行显示不完*/}
          {/*换行显示。这里是任务详情描述，默认显示全部，一*/}
          {/*行显示不完换行显示。这里是任务详情描述，默认显*/}
          {/*示全部，一行显示不完换行显示。这里是任务详情描*/}
          {/*述，默认显示全部，一行显示不完换行显示。*/}
          {!empty(workDetails)&&workDetails[0].art_content}
        </div>
        <WhiteSpace />
        <List className="my-list">
          <Item extra={!empty(workDetails)&&workDetails[0].begin_time}>开始时间</Item>
        </List>
        <List className="my-list">
          <Item extra={!empty(workDetails)&&workDetails[0].end_time}>结束时间</Item>
        </List>
        <div style={{display:'flex',backgroundColor:'white',padding:'0.25rem 0 0.25rem 0.25rem'}}>
          <div style={{margin:"auto 0",width:'40%'}}>图片</div>
          <div style={{width:'60%',display:"flex"}}>
            <div className={styles.imgs}>
              <img src={new1} alt="" style={{width:'100%',height: '100%'}} />
            </div>
            <div className={styles.imgs} >
              <img src={new1} alt="" style={{width:'100%',height: '100%'}} />
            </div>
            <div  className={styles.imgs} >
              <img src={new1} alt="" style={{width:'100%',height: '100%'}} />
            </div>
            <div  className={styles.imgs}>
              <img src={new1} alt="" style={{width:'100%',height: '100%'}} />
            </div>
          </div>
        </div>
        <WhiteSpace />
        {
          query.id === 'fail' ? <List className="my-list">
            <Item extra={'重复提交'}>未通过原因</Item>
          </List>:null
        }
        <WhiteSpace />
        <Flex justify="between" align="center" className={styles.who}>
          <Flex justify="start" align="center">
            <div style={{width: '0.6rem',height: '0.6rem',marginRight: '0.2rem'}}>
              <img src={new1} alt="" style={{width:'100%',height: '100%'}} />
            </div>
            <div>我  提交了申请</div>
          </Flex>
          <div>{!empty(workDetails)&&workDetails[0].art_create_time}</div>
        </Flex>
        {
          query.id === 'examine' ? null:<Flex justify="between" align="center" className={styles.who}>
            <Flex justify="start" align="center">
              <div style={{width: '0.6rem',height: '0.6rem',marginRight: '0.2rem'}}>
                <img src={new1} alt="" style={{width:'100%',height: '100%'}} />
              </div>
              <div>上级  {state}</div>
            </Flex>
            <div>2017-09-26 14:30</div>
          </Flex>
        }

      </div>
    );
	}

}

function mapStateToProps({ infor,workLog }){
  return {
    infor,
    workLog
	};
}

const Wrapper = createForm()(WorkAdd);

export default connect(mapStateToProps)(Wrapper);
